/* flex布局-------------------------------------------------------------------------------------------- */
//居中对其
.fc {
  display: flex;
  justify-content: center;
  align-items: center;
}

//居中左对齐
.flc {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

//居中右对齐
.frc {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
//居中左右对齐
.fbc {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.flex-1 {
  flex: 1;
}

/* -------------------------------------------------------------------------------------------- */

/* 一行省略号 */
.elliptical-1 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* 两行省略号 */
.elliptical-2 {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;

  /* autoprefixer: ignore next */
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
/* 三行省略号 */
.elliptical-3 {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  /* autoprefixer: ignore next */
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
/* 五行省略号 */
.elliptical-5 {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  /* autoprefixer: ignore next */
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 5;
}
/* 五行省略号 */
.elliptical-8 {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  /* autoprefixer: ignore next */
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 8;
}

// vue默认过渡动画
.v-enter-active,
.v-leave-active {
  transition: opacity 0.5s ease;
}

.v-enter-from,
.v-leave-to {
  opacity: 0;
}

// * 自定义滚动条样式 */
.my-scrollbar {
  &::-webkit-scrollbar {
    width: 4px; /* 滚动条宽度 */
    height: 4px;
  }

  &::-webkit-scrollbar-track {
    background-color: #f1f1f1; /* 滚动条背景颜色 */
  }

  &::-webkit-scrollbar-thumb {
    background: #c5c5c7; /* 滚动条滑块颜色 */
    border-radius: 5px; /* 滑块圆角 */
  }

  &::-webkit-scrollbar-thumb:hover {
    background: #949496; /* 鼠标悬停时滑块颜色 */
  }
}

.no-select {
  //文本无法选中
  user-select: none;
}

// table状态小圆点
.table__status {
  display: flex;
  align-items: center;

  &.status--success::before {
    margin-right: 8px;
    width: 6px;
    height: 6px;
    background: @success;
    border-radius: 50%;
    content: '';
  }

  &.error::before {
    margin-right: 8px;
    width: 6px;
    height: 6px;
    background: @danger;
    border-radius: 50%;
    content: '';
  }
}

.download-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  > p {
    color: rgba(16, 16, 20, 0.95);
    font-size: 14px;
    font-weight: 400;
    .elliptical-1();
  }
}

// spin
.spin-wrapper-class-name {
  width: 100%;
  height: 100%;

  .ant-spin-container {
    width: 100%;
    height: 100%;
  }
}

.default-graph-title {
  font-size: 14px;
  color: rgba(17, 22, 31, 0.29);
  font-weight: 400;
}

.font30b() {
  font-size: 30px;
  line-height: 38px;
  font-weight: 700;
}

.font24() {
  font-size: 24px;
  line-height: 32px;
}

.font24b() {
  font-weight: 700;
  font-size: 24px;
  line-height: 32px;
}

.font20b() {
  font-weight: 700;
  font-size: 20px;
  line-height: 28px;
}

.font18() {
  font-size: 18px;
  line-height: 26px;
}

.font18b() {
  font-weight: 700;
  font-size: 18px;
  line-height: 26px;
}

.font16() {
  font-size: 16px;
  line-height: 24px;
}

.font16b() {
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
}

.font14b() {
  font-weight: 700;
  font-size: 14px;
  line-height: 22px;
}

.font14() {
  font-size: 14px;
  line-height: 22px;
}

.font12() {
  font-size: 12px;
  line-height: 20px;
}

.font12b() {
  font-weight: 700;
  font-size: 12px;
  line-height: 20px;
}

.font10() {
  font-size: 10px;
  line-height: 14px;
}

.fw500() {
  font-family: 'fw500';
}

.cursor {
  cursor: pointer;
}

.text-color-1 {
  color: @text01;
}

.text-color-2 {
  color: @text02;
}

.text-color-3 {
  color: @text03;
}

.text-color-4 {
  color: @text04;
}
